<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>注册</title>
    <link th:href="@{/css/login.css}" rel="stylesheet"/>
</head>
<body>
<div class="auth-container">
    <div class="form-container">
        <h2>注册</h2>
        <form onclick="validateRegister(Event)" action="/register" method="POST">
            <label for="username">用户名</label>
            <input type="text" id="username" name="username" required placeholder="请输入您的用户名">

            <label for="password">密码</label>
            <input type="password" id="password" name="password" required placeholder="请输入您的密码">

            <label for="confirm-password">确认密码</label>
            <input type="password" id="confirm-password" name="confirm-password" required placeholder="请再次输入密码">

            <button type="submit" class="btn">注册</button>
            <p>已有账号？<a href="login">立即登录</a></p>
        </form>
    </div>
</div>
</body>
<script>

    function validateRegister(Event) {
            Event.preventDefault(); // 防止默认表单提交

        const username = document.getElementById('username').value;
        const password = document.getElementById('password').value;
        const confirmPassword = document.getElementById('confirm-password').value;


        if (password !== confirmPassword) {
            alert('密码与确认密码不一致');
            return;
        }

        // 注册成功的逻辑
        alert('注册成功');
        // 这里可以重定向到其他页面
    }

</script>
</html>
